<template>
  <div>
      <div style="background-color: white">
      <el-row>
          <el-col :span="3" :pull="0">
                <span style="color: #606266;font-size:25px;font-weight:bold" href="#">房屋收费</span>
            </el-col>
            <el-col :push="17" :span="6">
                <el-button @click="demo()">上一页</el-button>
            </el-col>
    </el-row>
    <el-row>
        <el-col :span="5">
        <a style="color: #606266" href="#">首页</a>
        <a style="color: #dcdfe6" href="#">/ 资产管理 </a>
        <a style="color: #dcdfe6" href="#">/ 楼栋信息</a></el-col
      >
    </el-row>
      </div>
    <hr />
    <el-row>
        <el-col  :span="2">
            <span style="color: #606266;font-size:25px;font-weight:bold">{{this.$store.state.dingid}}号订单</span>
        </el-col>
    </el-row>
    <template>
      <el-table :data="pagination.records" style="width: 100%">
        <el-table-column sortable prop="id" label="费用ID" width="300">
        </el-table-column>
          <el-table-column prop="Start" label="缴费起始时间" width="300">
        </el-table-column>
        <el-table-column prop="end" label="缴费结束时间" width="300">
        </el-table-column>
        <el-table-column prop="Cost" label="缴费时间" width="300">
        </el-table-column>
        <el-table-column prop="status" label="状态" width="300">
        </el-table-column>
      </el-table>
      <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="pagination.current"
      :page-sizes="[3, 5, 8, 10]"
      :page-size="pagination.size"
      layout="total, sizes, prev, pager, next, jumper"
      :total="pagination.total"
    >
    </el-pagination>
    </template>
  </div>
</template>

<script>
export default {
data(){
  return{
     pagination:[]
  };
},
methods: {
    demo(){
        this.$router.push("/feiyong/dingdan");
    },
    find(page=1,pageSize=5){
        let url="shoufei/selectByOrderid";
        console.log(this.$store.state.dingid);
        let param={page:page,pageSize:pageSize,id:this.$store.state.dingid};
        this.$axios.post(url,param).then(resp=>{this.pagination=resp.data.result;console.log(this.pagination);});
    },
    handleSizeChange(pageSize) {
      this.find(this.pagination.current, pageSize);
    },
    //当前页面发生改变，查询
    handleCurrentChange(page) {
      console.log(page)
      this.find(page, this.pagination.size);
    }
},
mounted(){
  this.find();
}
}
</script>

<style>

</style>